// miniprogram/pages/chart/f2-canvas/f2-canvas.js
import chartData from '../../../libs/data_chart'

Page({
  data: {
    opts: {
      //---------第一种方式：直接配置数据-----------
      onInit: initChart
    }
  },
  onLoad: function (options) {
    // 当多图表时，也可以以此方式绘制图表（以其中某一个图表举例）
    //以下两行写在绘制图表数据的地方
    //---------第二种方式：使用js方法配置数据-----------
    // let salesTrendChartComponent = this.selectComponent('#column-dom');
    // salesTrendChartComponent.init(initChart)

  },
  onReady: function () {

  },
  onShareAppMessage: function () {

  }
})
//数据初始化
let chart = null;

function initChart(canvas, width, height, F2) { // 使用 F2 绘制图表
  const data = chartData.data_sales
  chart = new F2.Chart({
    el: canvas,
    width,
    height
  });

  chart.source(data, {
    sales: {
      tickCount: 5
    }
  });
  chart.tooltip({
    showItemMarker: false,
    onShow(ev) {
      const {
        items
      } = ev;
      items[0].name = null;
      items[0].name = items[0].title;
      items[0].value = '¥ ' + items[0].value;
    }
  });
  chart.interval().position('year*sales');
  chart.render();
  return chart;
}